﻿<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <title>黑白棋</title>
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, minimal-ui">
    <link rel="stylesheet" type="text/css" media="screen" href="main.css" />
    <script src="./jquery-3.3.1.min.js"></script>
    <link rel="stylesheet" type="text/css" media="screen" href="main.css"/>
</head>

<body>

    <div id="show_menu">
        <input id="start_game" type="button" value="开始游戏">
        <br>
        <input id="show_menu_btn" type="button" value="设置">
        <pre id="bigtitle"><pre id="bigtitle1">黑</pre><pre id="bigtitle2">    白</pre><pre id="bigtitle3">  棋</pre></pre>
    </div>
    <div id="menu">
        <div class="bg bg-blur"></div>
        <div class="content content-front">
            <h2 id="menu_set">设置</h2>
            <hr style="width:10em;height: 0.5px;border: none;border-top: 0.5px solid rgb(168, 157, 157);">
            <ul id="menu1">
                <li id="music">
                    <h3>音效</h3>
                    <input class="btn_start" id="music_button" type="button" value="开">
                    <input class="btn_start1" id="music_button1" type="button" value="关">
                </li>
                <li id="fir_piece">
                    <h3>我的棋色</h3>
                    <input class="btn_start" id="color_but1" type="button" value="黑色">
                    <input class="btn_start1" id="color_but2" type="button" value="白色">
                </li>
                <li>
                    <h3>先手</h3>
                    <input class="btn_start" id="but1" type="button" value="黑棋先行">
                    <input class="btn_start1" id="but2" type="button" value="白棋先行">
                </li>    
                <li>
                    <h3>单人模式</h3>
                    <input class="btn_start1" id="but3" type="button" value="是">
                    <input class="btn_start" id="but4" type="button" value="否">
                </li>
                <li>
                    <h3>难度</h3>
                    <input class="btn_start" id="difficulty1" type="button" value="简单">
                    <input class="btn_start1" id="difficulty2" type="button" value="中等">
                </li>
            </ul>
        </div>
        
    </div>

    <div id="canvas1">
        <canvas id="canvas" width="578" height="578"></canvas>
    </div>
    <div id="record0">
        <div id="huihe">
            第<input class="btn" id="huihe_btn" type="button" value="1">回合
        </div>
        <div id="score_border">
            <pre id="score1">黑 </pre>
            <input class="btn" id="fenshubiao" type="button" value="2 ：2">
            <pre id="score2"> 白</pre>
        </div>
        <div id="time_down">
            <pre id="time_down1" style="color:coral;font-size:2em">黑方</pre>
            <pre id="time_down0">剩余</pre>
            <input id="time_down_btn" class="btn" type="button" value="10"> 秒
        </div>
    </div>

    <script src="main.js"></script>

</body>

</html>